<template>
    <div>
      <Headerewm></Headerewm>
      <div class="admin_main">
      	<div class="crumbs-nav">
      		<router-link to="/">首页</router-link> &gt; <span>报名</span>
	        </div>
	        <h2 class="admin-title">填写报名信息</h2>

	        <div class="main-form">
            <div class="form-li">
              <label for="username">姓名：</label>
              <div class="form-box">
                <input type="text" placeholder="请输入报名人姓名" id="username" v-model="todos[0].username" autocomplete="off">
              </div>
            </div>
            <div class="form-li">
              <label for="phone">联系电话：</label>
              <div class="form-box">
                <input type="text" placeholder="请输入联系电话" id="phone" v-model="todos[0].phone" autocomplete="off">
              </div>
            </div>
            <div class="form-li">
              <label for="add_time">报名时间：</label>
              <div class="form-box">
                <input type="text" placeholder="报到时间" id="add_time" v-model="todos[0].add_time" autocomplete="off">
              </div>
            </div>

            <div class="form-li">
              <label for="message">备注(留言)：</label>
              <div class="form-box">
                <textarea placeholder="请输入主讲人" id="message" v-model="todos[0].message"></textarea>
              </div>
            </div>
            <div class="form-li">
              <label></label>
              <div class="form-box">
                <input type="submit" value="提交" @click="posts">
              </div>
            </div>
	        </div>
      </div>
    </div>
</template>

<script>
import Headerewm from '../comments/Headerewm'
import qs from 'qs'
export default {
  name: 'home_ewm',
  components: {
    Headerewm
  },
  data () {
    return {
      todos: [
        {
          username : '',
          phone: '',
          add_time: '',
          message:'',
          home_id: this.$route.query.id
        }
      ]
    }
  },
  mounted() {
    laydate.render({
      elem: "#add_time", // 指定元素
      type: "datetime", // 组件的类型：year,month,time···
      done: value => { // 点击确认执行的回调函数，会把当前选择的时间传入进来
        // 把选择的时间赋值给先前定义好的变量，显示在页面
        this.todos[0].add_time = value;
      }
    });
  },
  methods: {
    posts () {
      this.$axios.post('/api/home_addPeople',qs.stringify({addContent:this.todos}, { indices: false }))
        .then(res=>{
          if(res.data.code == 1){
            alert(res.data.message);
          }
          if(res.data.code == 2){
            alert(res.data.message);
          }
          if(res.data.code == 3){
            alert(res.data.message);
          }
          if(!res.data.code){
            alert(res.data.message);
            window.location.reload();
          }
        })
        .catch(err=>{
          console.log(err);
        })
    }
  }
}
</script>
<style scoped>
  .crumbs-nav{display: none;}
  .header .header-box ul{display: none;}
  .header .header-box .header-user{display: none;}
  .main-form .form-li label{width: 80px!important;}
  .main-form .form-li .form-box{margin-left: 80px!important;}
  .main-form .form-li .form-box input[type='text']{width: 200px!important;}
  .main-form .form-li .form-box textarea{width: 200px!important;}
</style>
